<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"  xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui"
      xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">    

    <ui:composition template="/template.xhtml">        
        <ui:define name="title">
            <h:outputText value="#{periodoLabels.TituloCrearNuevo}"></h:outputText>
        </ui:define>

        <ui:define name="body">                        
            <h:form id="frmCrearPeriodos" style="font-size: small" enctype="multipart/form-data">                                
                <p:panel header="Ejecución" style="background: white" >                    
                    <p:accordionPanel multiple="true">                        
                        <p:tab title="Hoja de trabajo">
                            <p:dataTable id="basicDT2" var="car2" value="#{ejecucionController.ejecuciones}" 
                                         style="font-size: small; margin-top:20px">                               
                                <f:facet name="header">
                                    Tabla de Trabajo
                                </f:facet>                                
                                <p:column headerText="Nro.">
                                    <div align="center">
                                        <p:outputLabel value="#{car2.num}" />
                                    </div>                                    
                                </p:column>
                                <p:column headerText="Vuelta" style="width: 50px">
                                    <div align="center">
                                        <p:outputLabel value="#{car2.vuelta}" />
                                    </div>                                                                        
                                </p:column>
                                <p:column headerText="Unidad Prog." style="width: 50px">
                                    <div align="center">
                                        <p:outputLabel value="#{car2.unidadProg}" />
                                    </div>                                   
                                </p:column>
                                <p:column headerText="Registro Municipal" style="width: 50px">
                                    <div align="center">
                                        <p:outputLabel value="#{car2.habilitacionProg}" />
                                    </div>                                    
                                </p:column>                                
                                <p:column headerText="Unidad Real." style="width: 50px">
                                    <div align="center">
                                        <p:inputText style="text-align: center; width: 50px" value="#{car2.unidadReal != null ? car2.unidadReal : "-" }">
                                        </p:inputText>
                                    </div>                
                                </p:column>
                                <p:column headerText="Registro Municipal" style="width: 50px">
                                    <div align="center">
                                        <p:inputText readonly="true" style="text-align: center; width: 50px" value="#{car2.habilitacionReal}"/>
                                    </div>                                                    
                                </p:column>
                                <p:column headerText="Hora de Salida Prog." style="width: 100px">
                                    <div align="center">
                                        <p:outputLabel value="#{car2.horaInicioProg}" >
                                            <f:convertDateTime pattern="HH:mm" locale="es_EC" timeZone="America/Guayaquil" />
                                        </p:outputLabel>
                                    </div>                                                                        
                                </p:column>
                                <p:column headerText="Hora de Salida Real." style="width: 75px">
                                    <div align="center">
                                        <p:inputText style="text-align: center; width: 75px" readonly="true" value="#{car2.horaInicioReal}">
                                            <f:convertDateTime pattern="HH:mm" locale="es_EC" timeZone="America/Guayaquil" />
                                        </p:inputText>
                                    </div>                                                                        
                                </p:column>
                                <p:column headerText="Hora de Retorno Prog." style="width: 100px">
                                    <div align="center">
                                        <p:outputLabel value="#{car2.horaFinProg}" >
                                            <f:convertDateTime pattern="HH:mm" locale="es_EC" timeZone="America/Guayaquil" />
                                        </p:outputLabel>
                                    </div>                                      
                                </p:column>
                                <p:column headerText="Hora de Retorno Real." style="width: 100px">
                                    <div align="center">
                                        <p:inputText style="text-align: center; width: 75px" readonly="true" value="#{car2.horaFinReal}">
                                            <f:convertDateTime pattern="HH:mm" locale="es_EC" timeZone="America/Guayaquil" />
                                        </p:inputText>
                                    </div>                                                                        
                                </p:column>
                                <p:column headerText="Código del Conductor" style="width: 100px">
                                    <div align="center">
                                        <p:inputText style="text-align: center; width: 50px" value="#{car2.choferId}"/>
                                    </div>                                      
                                </p:column>
                                <p:column headerText="Código del Ayudante" style="width: 100px">
                                    <div align="center">
                                        <p:inputText style="text-align: center; width: 50px" value="#{car2.ayudanteId}"/>
                                    </div>                                      
                                </p:column>
                                <p:column headerText="Observaciones" style="width: 150px">
                                    <p:selectOneMenu style="width: 270px" panelStyle="width:500px" id="subscriptions" value="#{choferController.selected.tipoLicencia}">                                    
                                        <f:selectItem id="item1" itemLabel="Seleccionar..." itemValue="" />
                                        <f:selectItem id="item2" itemLabel="Observacion 1" itemValue="Tipo E" />
                                        <f:selectItem id="item3" itemLabel="Observacion 2" itemValue="Tipo E1" />
                                        <f:selectItem id="item4" itemLabel="Observacion 3" itemValue="Tipo G" />                                    
                                    </p:selectOneMenu>
                                </p:column>
                                <p:column headerText="Observaciones">
                                    <div align="center">
                                        <p:commandButton ajax="false" update="basicDT2" icon="ui-icon-clock" style="width: 150px;" action="#{ejecucionController.registrarHoraInicio(car2.num)}" value="Salida"/>                                                                            
                                        <p:commandButton ajax="false" update="basicDT2" icon="ui-icon-clock" style="width: 150px;" action="#{ejecucionController.registrarHoraLlegada(car2.num)}" value="Llegada"/>
                                    </div>
                                </p:column>

                            </p:dataTable>                            
                        </p:tab>
                    </p:accordionPanel>
                </p:panel>                             
            </h:form>
        </ui:define>
    </ui:composition>
</html>

